<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <style type="text/css">
    	*{margin: 0;padding: 0;}
    	.mui-table-view-cell-h2{font-size: 15px;}
    	.mui-table-view-cell-p{font-size: 12px;}
    	.mui-table-view-chevron li{padding-right: 0;}
    	
    </style>
</head>
<body>
	<header class="mui-bar mui-bar-nav">
	    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	    <h1 class="mui-title">一些新闻</h1>
	</header>
	<!--下拉刷新容器-->
	<div id="refreshContainer" class="mui-content mui-scroll-wrapper">
	  <div class="mui-scroll">
	    <!--数据列表-->
	    <ul class="mui-table-view mui-table-view-chevron">
	    </ul>
	  </div>
	</div>
	
	<script src="js/template-web.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/html" id="newli">
		<% for(var i=0;i<5;i++){ %>
			<li class="mui-table-view-cell" data-link ="<%= data[i].link %>">
	            <h2 class="mui-table-view-cell-h2"> <%=data[i].title %></h2>
	            <p class="mui-table-view-cell-p"> <%=data[i].desc %> </p>
		    </li>
		<%}%>
	</script>
	
	<script src="js/mui.min.js"></script>
    <script type="text/javascript" charset="utf-8">
      	
      	mui.init({
      		pullRefresh: {
      			container: '#refreshContainer',
      			up: {
      				auto: true,
      				callback: pullupRefresh 
      			}
      		}
      	})
      	mui.plusReady({
      		
      	})
      	mui('.mui-table-view-chevron').on('tap',"li",function(){
      		var link=this.getAttribute("data-link");
        	var detail= mui.preload({
        		url:"detil.html",
        		id:"detal"
        	})
        	alert(detail);
      		mui.fire(detail,'ready',{
      			link:link
      		})
      		mui.openWindow({
      			url:"detil.html",
      			id:'detal'
      		})
      	})
      	var alltime=0;
      	function pullupRefresh(){
      		alltime++;
      		if(alltime >=5){
      			mui('#refreshContainer').pullRefresh().endPullupToRefresh(true);
      		}else{
	      		mui.ajax('http://route.showapi.com/109-35', {
					data: {
						showapi_appid: 37456,
						showapi_sign: '60a9f0b90153452c92c40cfced777c28'
					},
					dataType: 'json', //服务器返回json格式数据
					type: 'post', //HTTP请求类型
					timeout: 1000, //超时时间设置为10秒；              
					success: function(data) {
						//服务器返回响应，根据响应结果，分析是否登录成功；
						var data=data.showapi_res_body.pagebean.contentlist;
						var li=template('newli',{data:data});
						
						$('.mui-table-view-chevron').append (li)
					},
					error: function(xhr, type, errorThrown) {
						//异常处理；
//							console.log(type);
//							console.log("s")
					}
      			})
	      		mui('#refreshContainer').pullRefresh().endPullupToRefresh();
      		}
      	}
    </script>
</body>
</html>